<!doctype html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>支付订单</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Wx/css/base.css" />
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Wx/css/detail.css" />
</head>
<body>
<div class="detail" style="padding-bottom:60px;">
    <div class="state">
        <div class="inner">
            <h2>待付款</h2>
            <span><img src="__PUBLIC__/Wx/img/icon04.png"/></span>
            <p>本商品为自提商品，社区店二次分拣，开心享受家乡美味！</p>
        </div>
    </div>
    <div class="money02">
        <h1>乡土味士</h1>
        <h2>￥{$order_info.total_fee}</h2>
    </div>
    <div class="payway">
        <ul>
            <li>
                <span style="background:url(__PUBLIC__/Wx/img/wechat02.png) no-repeat left center; background-size:23px 20px;">微信支付</span>
                <input type="radio" name="on"  checked class="selected"/>
            </li>
            <if condition="$credit2 EGT $order_info['total_fee']">
                <li id="code02"><span>卡额支付</span><em>（剩余<b>{$credit2}</b>元）</em><input type="radio" name="on"/></li>
            <else />
                <li class="no">
                    <span>卡额支付</span><em>（卡额不足，剩余<b>{$credit2}</b>元）</em><input type="radio" name="on" disabled="true"/>
                </li>
            </if>
        </ul>
    </div>
    <div class="ordermess">
        <p>创建时间：{$order_info.addtime|date="Y-m-d H:i:s",###}</p>
        <p>订单编号：{$order_info.order_sn}</p>
    </div>

    <div class="button"><input type="button" value="确认支付"/></div>
    <input type="hidden" id="orderId" value="{$order_info.id}">

    <!--用户卡额大于商品总金额时才会出现输入密码的 弹框-->
    <if condition="$credit2 EGT $order_info['total_fee']">
    <div class="hint04">
        <div class="shadow">
            <div class="close"></div>
            <div class="succeed">
                <h2>请输入卡额支付密码</h2>
                <h3>乡土味士</h3>
                <h4>￥{$order_info.total_fee}</h4>
                <form method="post" id="js_form">
                    <h5><input type="password" name="password" placeholder="请输入卡额支付密码" required/></h5>
                    <p>
                        <input type="button" value="取消" class="left"/>
                        <input id="button" type="button" value="确定" class="right"/>
                    </p>
                </form>
            </div>
        </div>
    </div>
    </if>
</div>

<script src="__PUBLIC__/Wx/js/jquery.js" ></script>
<script src="__PUBLIC__/js/layer/layer.js"></script>

<script>
    // 表单提交
    $('#button').click(function(){
        var order_id = $("#orderId").val();
        $.ajax({
            type: "POST",
            url:"/Api/Weixinpay/cardPay/order_id/"+order_id,
            data:$('#js_form').serialize(),// 要提交的表单
            success: function(data) {
                //提交成功后调用
                if(data.status==1) {
                    $('.hint04').css('display','none');
                    layer.msg(data.info, {icon:1,time:1000}, function(){
                            window.location.href= data.url;
                        });
                }else{
                    layer.msg(data.info, {icon:2,time:1000},function () {
                        window.location.href= data.url;
                    });
                }
            },
            error: function(error){alert(error);}
        });
    })




</script>

<script type="text/javascript">
    $('.payway ul li input').click(function(){
        $(this).addClass("selected").parents('li').siblings('li').children('input').removeClass();
    });
    $(".button").click(function(){
        if($('#code02 input').hasClass("selected")){
            var order_id = $("#orderId").val();
            var u_pass = '{$u_pass}';
            if(u_pass==''){
                layer.alert('前去填写卡额支付密码', {icon:2,time:2000}, function(){
                    window.location.href = 'http://www.xiangtws.com/Wx/MySet/password/order_id/'+order_id;
                });
            }else{
                $('.hint04').css('display','block');
            }
        }else{
            var order_id = $("#orderId").val();
            window.location.href = 'http://www.xiangtws.com/Api/Weixinpay/pay?order_id='+order_id;
        }
    });
    $('.hint04 .close').click(function(){
        $('.hint04').css('display','none')
    });
    $('.hint04 .left').click(function(){
        $('.hint04').css('display','none')
    });
</script>

</body>
</html>